<template>
  <div>
    <el-select v-model="theSupplier_id" clearable placeholder="请选择供应商">
      <el-option
        v-for="item in allSupplier"
        :key="item.supplier_id"
        :label="item.supplier_name+'-'+item.supplier_phone"
        :value="item.supplier_id"
      ></el-option>
    </el-select>
    <el-date-picker
      v-model="theDate"
      type="daterange"
      align="left"
      range-separator="至"
      start-placeholder="开始日期"
      end-placeholder="结束日期"
      :picker-options="pickerOptions"
      value-format="yyyy-MM-dd "
    ></el-date-picker>
    <el-input
      style="width:200px;"
      clearable
      v-model="searchText"
      placeholder="请输入查询关键字"
      @keydown.enter.native="doSearch()"
    ></el-input>
    <el-button type="success" @click="doSearch()" class="added">搜索</el-button>
  </div>
</template>
<script>
export default {
  data() {
    return {
      loading: "",
      theSupplier_id: "",
      allSupplier: [
        {
          supplier_id: 3,
          supplier_name: "万达",
          supplier_phone: "123456789111",
          supplier_address: "南京路",
          supplier_contact_ren: "王莽",
          remark: "测试1",
          supplier_yuliu1: "编号12345",
          supplier_yuliu2: null
        },
        {
          supplier_id: 4,
          supplier_name: "5634534",
          supplier_phone: "5656",
          supplier_address: "565",
          supplier_contact_ren: "5656345435",
          remark: "565",
          supplier_yuliu1: "56",
          supplier_yuliu2: null
        }
      ],
      theDate: "", //日期范围
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            }
          }
        ]
      }
    };
  },
  components: {},
  methods: {
    openLoading() {
      this.loading = this.$loading({
        lock: true,
        text: "Loading",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
    },
    getDate() {
      var dateOne = "";
      var dateTwo = "";
      if (isEmpty(this.theDate)) {
        dateOne = "";
        dateTwo = "";
      } else {
        dateOne = this.theDate[0];
        dateTwo = this.theDate[1];
      }
    }
  },
  created() {},
  mounted() {}
};
</script>
<style scoped>
</style>


